<template>
  <div class="header_container">
    <van-nav-bar :title="text" left-text="" :right-text="rightText" :left-arrow="goback" @click-left="onClickLeft" @click-right="onClickRight" />
  </div>
</template>
<script>
export default {
  props: {
    text: { type: String, default: '模板' },
    rightText: { type: String, default: '' }, // 右侧如果有按钮的话  文本信息
    goback: { type: Boolean, default: true },
    rightFun: { type: Function, default: () => {} } // 右侧按钮对应的事件
  },
  methods: {
    onClickLeft() {
      // this.$store.commit("setTransition", "turn-off")
      const skey = this.$route.query.skey || 0
      if (!skey) this.$router.go(-1)
      else this.$router.push('/')
    },
    onClickRight() {
      this.rightFun && this.rightFun()
    }
  }
}
</script>
<style lang="less" scoped>
@hHeight: 50px;
.header_container {
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  color: #777;
  font-size: 15px;
  position: fixed;
  line-height: @hHeight;
  text-align: center;
  background-color: #fff;
  // border-bottom: 1px solid #ebedf0;
  .icon_header_arrow {
    width: 40px;
    height: @hHeight;
    left: 0;
    top: 0;
    position: absolute;
    line-height: 50px;
    font-size: 20px;
  }

  & /deep/ .van-icon-arrow-left {
    color: #777;
  }
}
</style>
